C S S   -   Cascading Style Sheets

2.   selektoren

2.6  pseudoklassen

Eine pseudoklasse kann in einer regel entweder für ein bestimmtes tag oder für jedes beliebige tag vereinbart werden. Das besondere daran ist, dass die vereinbarung/en der regel für bestimmte effekte verwendet werden.

tag:pseudo { vereinbarung/en } pseudoklasse für ein bestimmtes tag
tag.klasse:pseudo { vereinbarung/en } pseudoklasse für ein bestimmtes tag mit dieser klasse
.klasse:pseudo { vereinbarung/en } pseudoklasse für jedes beliebige tag mit dieser klasse

Die mit pseudo bestimmten effekte werden entsprechend der/den in der regel getroffenen vereinbarung/en für das element ausgeführt, das mit der pseudoklasse ausgezeichnet ist. Für pseudo sind folgende angaben möglich:

hover beim berühren des elements zeigt das element den sog hover-effekt.
first-line die erste zeile des elements wird entsprechend der/den für first-line getroffenen vereinbarung/en angezeigt.
first-letter das erste zeichen des elements wird entsprechend der/den für first-letter getroffenen vereinbarung/en angezeigt.
after der mit der eigenschaft content festgelegte wert wird an das element angefügt.
bevordas gegenstück zu after, funktioniert aber nicht.

beispiel - regeln

h3:hover{ color: red; } alle tags vom typ h3 zeigen den hover-effekt
.hov:hover{ color: red; } hover-effekt für alle tags mit der klasse hov
h2:first-line{ color: red; } die erste zeile aller überschriften h2 wird rot angezeigt
.fili:first-line{ color: blue; } die erste zeile des elements mit der klasse fili ist blau
.filett:first-letter{ color: blue; } das erste zeichen des elements mit der klasse filett ist blau
.nach:after{ content: "xxxx"; } jedem element mit der klasse nach wird der text xxxx angefügt

überschrift mit hover-effekt

absatz mit hover-effekt
zwei zeilen

die erste zeile der überschrift ist rot
dann normal

die erste zeile ist blau
dann normal

Das erste zeichen ist blau

AAAAAAAAAA


zum untermenü


    IMPRESSUM  

    KONTAKT  

    PRIVAT  

    D O K U  


  H T M L  
  c s s
  P H P  
  My S Q L  
  JAVASCRIPT